<div class="table-responsive">
    <table class="table table-hover table-bordered">
        <thead>
            <tr>
                <th class="no-wrap">
                    {{ trans('permission.permission.display_name') }}
                </th>
                <th class="no-wrap">
                    {{ trans('permission.role.name') }}
                </th>
                <th class="no-wrap">
                    {{ trans('permission.role.personal') }}
                </th>
                <th class="no-wrap">
                    {{ trans('system.actions') }}
                </th>
            </tr>
        </thead>
        <tbody>
            @foreach($aData as $key => $permission)
            <?php
            $roles = $permission->roles()->get();
            $theme = [
                'badge-success',
                'badge-primary',
                'badge-info',
                'badge-danger',
                'badge-warning',
                'badge-default',
            ];
            ?>
            <tr>
                <td class="no-wrap">
                    {{{ $permission->display_name }}}
                </td>
                <td>
                    @foreach($roles as $key => $role )
                    @if($role->type == 'GROUP')
                    <span class="badge-large badge {{{$theme[$key%5]}}}">
                        {{{ $role->name }}}
                    </span>
                    @endif
                    @endforeach
                </td>
                <td>
                    @foreach($roles as $key => $role )
                    @if($role->type == 'PERSONAL')
                    <?php
                    $user  = User::find($role->name);
                    ?>
                    <span class="badge-large badge {{{$theme[$key%5]}}} margin">
                        {{{ $user->id }}} - {{{ $user->username }}}
                    </span>
                    @endif
                    @endforeach
                </td>
                <td>
                    <a class="btn default yellow-stripe btn-xs btn-edit {{ CNamHoa::getHideClass('permission-edit', ['addClass' => 'hide']) }}" data-url="{{ route('permission-edit', ['page' => $page, 'id' => $permission->id ]) }}">
                        <i class="fa fa-pencil"></i> {{ trans('system.button.edit') }}
                    </a>
                </td>
            </tr>
            @endforeach
        </tbody>
    </table>
</div>